<template>
  <view class="hot-item">
    <image :src="image" mode=""></image>
    <view class="right">
      <text class="title">{{title}}</text>
      <slot></slot>
      <text>{{count}}</text>
    </view>
  </view>
</template>
<script>
  export default {
    props: {
      image: {
        type: String,
        default: ''
      },
      title: {
        type: String,
        default: ''
      },
      count: {
        type: Number,
        default: 0
      }
    }
  }
</script>
<style lang='scss' scoped>
  .hot-item {
    display: flex;
    border-bottom: 1rpx solid #ccc;
    padding: 10rpx;
    image {
      width: 340rpx;
      height: 180rpx;
    }
    .right {
      padding: 10rpx;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      .title {
        font-weight: bold;
      }
    }
  }
</style>
